﻿@model Web.ViewModel.HotelList
@using PagedList.Mvc;
<div class="row">
    <div class="col-lg-12">
        <h3 class="page-header"><i class="fa fa-laptop"></i> Lista hoteli</h3>
        <ol class="breadcrumb">
            <li><i class="fa fa-home"></i><a href="@Url.Action("Index","Hotel")">Hotele</a></li>
            <li><i class="fa fa-laptop"></i>Lista hoteli</li>
        </ol>
    </div>
</div>

<section class="panel">
    <table class="table table-striped table-advance table-hover">
        <tbody>
            <tr>
                <th>Nazwa hotelu</th>
                <td>Typ</td>
                <th>Kraj</th>
                <th>Miasto</th>
                <th>Adres</th>
                <th>Kod pocztowy </th>
                <th></th>
            </tr>
            @foreach (var item in Model.List)
            {
                <tr>
                    <td>@item.Name</td>
                    <td>@item.AccomodationType</td>
                    <td>@item.Country</td>
                    <td>@item.City</td>
                    <td>@item.AddressStreet</td>
                    <td>@item.ZipCode</td>
                    <td>
                        <button class="hotel-details btn btn-primary"  data-id="@item.Token">Szczegóły</button>
                    </td>
                </tr>
            }
        </tbody>
    </table>
    <div style="text-align:right;">Strona @(Model.TotalPage < Model.CurrentPage ? 1 : Model.CurrentPage) of @Model.TotalPage </div>
    <div class="text-center">@Html.PagedListPager(Model.List, page => Url.Action("Index", new { page }))</div>
</section>

<div id="hotel-details-wrapper"></div>

@section Scripts
{
    <script type="text/javascript">
        $(document).ready(function () {
            $('.hotel-details').live('click', function (e) {
                e.preventDefault();
                var id = $(this).attr('data-id');
                $.ajax({
                    url: '/Hotel/Details?token='+id,
                    type: 'get',
                    success: function (result) {
                        $('#hotel-details-wrapper').html(result);
                       
                        $('#hotel-modal').modal("show");
                    },
                    error: function (result) {
                      
                    }
                });
            });
        });
    </script>
}